<template>
	<view>
		<view class="uni-header">
			<!-- <view class="uni-group hide-on-phone">
				<view class="uni-title">{{ $t('demo.table.title') }}</view>
			</view> -->
			<view class="uni-group">
				<!-- 输入框 -->
				<input class="uni-search" type="text" v-model="searchVal" @confirm="search" :placeholder="$t('common.placeholder.query')" />
				<!-- 搜索按钮 -->
				<button class="uni-button" type="default" size="mini" @click="search">{{ $t('common.button.search') }}</button>
				<!-- 上传文件按钮 -->
				<button class="uni-button" type="primary" size="mini" @tap="uploadNewFile">{{ $t('common.button.uploadFile') }}</button>
			</view>
		</view>
		<view class="uni-container">
			<!-- 表格组件 -->
			<uni-table :loading="loading" border stripe type="selection" :emptyText="$t('common.empty')" @selection-change="selectionChange">
				<uni-tr>
					<!-- 表头列 -->
					<uni-th width="100" align="center">编号</uni-th>
					<uni-th align="center">文件名称</uni-th>
					<uni-th align="center">文件路径</uni-th>
					<uni-th align="center">操作</uni-th>
				</uni-tr>
				<uni-tr v-for="(item, index) in tableData" :key="item.id">
					<!-- 表格数据列 -->
					<uni-td>{{ item.id }}</uni-td>
					<uni-td>
						<view class="name">{{ item.name }}</view>
					</uni-td>
					<uni-td>
						<view class="name">{{ item.path }}</view>
					</uni-td>
					<uni-td>
						<view class="uni-group">
							<!-- 查看详情按钮 -->
							<button class="uni-button" size="mini" type="primary" @tap="reviewFileDetail(item)">{{ $t('common.button.review') }}</button>

							<!-- 删除按钮 -->
							<button class="uni-button" size="mini" type="warn" @tap="delFileItem(item)">{{ $t('common.button.delete') }}</button>
						</view>
					</uni-td>
				</uni-tr>
			</uni-table>

			<view class="uni-pagination-box">
				<!-- 分页组件 -->
				<uni-pagination show-icon :page-size="pageSize" :current="pageCurrent" @change="change" />
			</view>
		</view>
		<!-- #ifndef H5 -->
		<fix-window />
		<!-- #endif -->
	</view>
</template>

<script>
// import { downloadFileAndRename } from '@/utils'
import Config from '@/config'

// 导出默认模块
export default {
	// 数据属性
	data() {
		return {
			// 搜索值
			searchVal: '',
			// 表格数据
			tableData: [],
			// 每页数据量
			pageSize: 10,
			// 当前页
			pageCurrent: 1,
			// 数据总量
			total: 0,
			// 加载状态
			loading: false,
			selectedIndexs: []
		}
	},
	onLoad() {
		// 获取第一页数据
		this.getData(1)
	},
	computed: {
		// 多选处理
		selectedItems() {
			return this.selectedIndexs.map((i) => this.tableData[i])
		},
		selectedIds() {
			return this.selectedItems.map((_) => _.id)
		}
	},
	// 方法
	methods: {
		uploadNewFile() {
			uni.chooseFile({
				count: 1,
				success: (res) => {
					console.log('chooseFile:', res)
					const file = res.tempFiles[0]
					const filePath = res.tempFilePaths[0]
					this.uploadPublicFile(filePath, 'fileUpload', '/document/security/add')
				}
			})
		},
		async uploadPublicFile(...args) {
			console.log(args)
			try {
				const res = await uni.$uu.Api.uploadFile(args[0], args[1], args[2])
				console.log(res)
				if (res.code === 100) {
					this.getData(1)
				}
			} catch (e) {
				console.log(e)
			}
		},
		reviewFileDetail({ path }) {
			const url = Config.filePath
			const webUrl = `${url}${path}`
			console.log('reviewFileDetail: ', webUrl)
			window.open(webUrl, '_blank')
		},
		delFileItem({ id }) {
			uni.showModal({
				title: '删除安全公示文件',
				content: '确定要删除当前项吗?',
				success: (res) => {
					if (res.confirm) {
						this.delPublicFile(id)
					}
				}
			})
		},
		async delPublicFile(id) {
			const params = {
				id
			}

			try {
				const res = await uni.$uu.Api.delPublicFile(params)
				console.log(res)
				if (res.code === 100) {
					uni.showToast({
						title: '删除成功',
						success: () => {
							this.getData(1)
						}
					})
				}
			} catch (e) {
				console.log(e)
			}
		},
		// 多选事件处理函数
		selectionChange(e) {
			console.log('selectionChange:', e)
			this.selectedIndexs = e.detail.index
		},
		// 批量删除函数
		delTable() {
			this.selectedItems()
		},
		// 分页触发事件处理函数
		change(e) {
			this.selectedIndexs = []
			this.getData(e.current)
		},
		// 搜索函数
		search() {
			this.getData(1, this.searchVal)
		},
		// 获取数据函数
		async getData(pageCurrent, value = '') {
			this.loading = true
			this.pageCurrent = pageCurrent

			const params = {
				page: this.pageCurrent,
				size: this.pageSize,
				name: value
			}

			try {
				const res = await uni.$uu.Api.getPublicFileList(params)
				console.log(res)
				if (res.code === 100) {
					this.tableData = [...res.content]
					this.loading = false
				}
			} catch (e) {
				console.log(e)
			}
		},
		// 伪request请求函数
		request(options) {
			const { pageSize, pageCurrent, success, value } = options

			let total = tableData.length

			let data = tableData.filter((item, index) => {
				const idx = index - (pageCurrent - 1) * pageSize
				return idx < pageSize && idx >= 0
			})

			if (value) {
				data = []
				tableData.forEach((item) => {
					if (item.risk_name.indexOf(value) !== -1) {
						data.push(item)
					}
				})
				total = data.length
			}

			setTimeout(() => {
				typeof success === 'function' &&
					success({
						data: data,
						total: total
					})
			}, 500)
		}
	}
}
</script>

<style>
/* #ifndef H5 */
page {
	padding-top: 85px;
}

/* #endif */
</style>
